<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="format-detection" content="telephone=no">
    <script src="/js/jquery/jquery.min.js"></script>
    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
    <title>签到</title>
    <link rel="stylesheet" href="/css/public.css"/>
    <link rel="stylesheet" href="/css/signin.css"/>
    <link rel="stylesheet" href="/js/plugins/dialog/dialog.css">
    <script src="/js/plugins/jquery-form/jquery.form.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <script src="/js/plugins/dialog/dialog.min.js"></script>
    <script src="/js/common.js"></script>

</head>

<body>
<a href="javascript:history.go(-1);" style="position: absolute;top: 10px;left: 22px;">
    <span><i class="fa fa-chevron-left fa-2x" style="color: white;"></i></span>
</a>
<div class="top flex flex-align-end flex-pack-center flex-warp">
    <div class="out-1 flex flex-align-center flex-pack-center" id="signIn">
        <div class="out-2 flex flex-align-center flex-pack-center">
            <div class="signBtn">
                <strong id="sign-txt">签到</strong>
                <span>连续<em id="sign-count">0</em>天</span>
            </div>
        </div>
    </div>
</div>
<div class="tips" id="signMsg">亲，连续签到三天有惊喜哦</div>
<div class="Calendar">
    <div id="toyear" class="flex flex-pack-center">
        <div id="idCalendarPre">&lt;</div>
        <div class="year-month">
            <span id="idCalendarYear">2018</span>年<span id="idCalendarMonth">6</span>月
        </div>
        <div id="idCalendarNext">&gt;</div>
    </div>
    <table border="1px" cellpadding="0" cellspacing="0">
        <thead>
        <tr class="tou">
            <td>日</td>
            <td>一</td>
            <td>二</td>
            <td>三</td>
            <td>四</td>
            <td>五</td>
            <td>六</td>
        </tr>
        </thead>
        <tbody id="idCalendar">
        </tbody>
    </table>
</div>
<script type="text/javascript" src="/js/rili.js"></script>
<script language="JavaScript">
    var isSign = false;
    var myday = []; //已签到的数组
    var user = getUser();//当前用户
    var cale;

    $.get("/users/" + user.id + "/signIns", function (data) {

        if (data) {
            //回显用户当月所有的签到日期
            $.each(data, function (i, ele) {
                myday[i]=ele/1000;
            });
        }

        cale = new Calendar("idCalendar", {
            qdDay: myday,
            onToday: function (o) {
                o.className = "onToday";
            },
            onSignIn: function () {
                $$("sign-txt").innerHTML = '已签到';
            },
            onFinish: function () {
                $$("sign-count").innerHTML = myday.length; //已签到次数
                $$("idCalendarYear").innerHTML = this.Year;
                $$("idCalendarMonth").innerHTML = this.Month; //表头年份
            }
        });

    });


    //上一个月
    $$("idCalendarPre").onclick = function () {
        cale.PreMonth();
    };
    //下一个月
    $$("idCalendarNext").onclick = function () {
        cale.NextMonth();
    };

    //添加今天签到
    $$("signIn").onclick = function () {
        var signinCount;
        if (isSign == false) {
            var res = cale.SignIn();
            if (res == '1') {
                $$("sign-txt").innerHTML = '已签到';
                $$("sign-count").innerHTML = parseInt($$("sign-count").innerHTML) + 1;
                isSign = true;
                //发送请求保存签到次数
                signinCount = $("#sign-count").html();
                $.post("/signins/" + user.id,{"signinCount": signinCount}, function (data) {
                    if (data.success){
                        if (signinCount>0&&signinCount<7){
                            $("#signMsg").html("今天已签到，获得"+signinCount+"个积分");
                        }else if (signinCount>=7){
                            $("#signMsg").html("今天已签到，获得7个积分");
                        }

                        if(signinCount%3==0){
                            if (signinCount==30){
                                $(document).dialog({
                                    titleShow: false,
                                    style: 'ios',
                                    content: '签到30天获得100积分大礼包'
                                });
                                return;
                            }

                            $(document).dialog({
                                titleShow: false,
                                style: 'ios',
                                content: '恭喜你！获得20积分'
                            });
                        }

                        if (signinCount==20){
                            $(document).dialog({
                                titleShow: false,
                                style: 'ios',
                                content: '签到20天获得50积分大礼包'
                            });
                        }
                    }

                });

            } else if (res == '2') {
                $$("sign-txt").innerHTML = '已签到';
                $(document).dialog({
                    titleShow: false,
                    style: 'ios',
                    content: '亲今天已经签到了，请明天再来！'
                });

            }
        } else {
            $(document).dialog({
                titleShow: false,
                style: 'ios',
                content: '亲今天已经签到了，请明天再来'
            });

        }
    }

</script>
</body>

</html>